<?xml version="1.0" encoding="ISO-8859-1" ?>
<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<%@page import="java.util.Iterator"%>
<%@page import="de.nava.informa.core.ItemIF"%>
<%@page import="java.util.Calendar"%>
<%@page import="de.nava.informa.parsers.FeedParser"%>
<%@page import="de.nava.informa.core.ChannelIF"%>
<%@page import="de.nava.informa.impl.basic.ChannelBuilder"%>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
	<!-- meta tags, link to css:  -->
	<%@ include file="./jsp-includes/mymetaheader.jsp" %>
	
	<!--  Ajax-Includes -->
    <script type='text/javascript' src='/GroupMe/dwr/interface/DWRUserManager.js'></script>
    <script type='text/javascript' src='/GroupMe/dwr/engine.js'></script>
    <script type='text/javascript' src='/GroupMe/dwr/util.js'></script>

	<title>GroupMe! - Support Center</title>
</head>
<body>
	<!-- title image, logo:  -->
	<a name="top"></a>
	<div id="groupme_header">
		<%@ include file="./jsp-includes/groupme_header.jsp" %>
	</div>
	
	<!-- Menu: -->
	<div id="menu">
		<%@ include file="./jsp-includes/groupme_menu.jsp" %>
	</div>
	<!-- content and sidebar -->
	<!-- Content: -->
	
	<div id="mycontent">
	
		<div id="help">
			<h2><a name="top" class="anker">GroupMe! Support Center</a></h2>
			
			<div id="help_contents">
				<h3>Contents</h3><br /><br />
				<a href="#section1">What is GroupMe! ?</a> <br />
				<a href="#section2">Create an account</a> <br />
				<a href="#section3">myGroupMe! - Your personal GroupMe! home page</a> <br />
				<a href="#section4">Build groups</a> <br />
				<a href="#section5">Browsing through GroupMe!</a><br />
				<a href="#section6">Using the bookmarklet functionality</a><br />
				<a href="#api">GroupMe! API</a><br />
			</div>
			
			<div id="help_content">
			
				<h3><a name="section1" class="anker">What is GroupMe! ?</a></h3>
				
				<div class="section">
				GroupMe is a social tagging system where you can organize your bookmarks in groups of a certain topic and share them with other people. It has has an intuitive and fancy user interface.
				<br />If you want to know more about GroupMe! and its benefits then come around <a href="<%= request.getContextPath() + "/" + VIEW_VOCABULARY.ACTION_ABOUT%>" title="GroupMe! Background">here</a> and don't forget to check out our <a href="<%= request.getContextPath() + "/blog/"%>" title="GroupMe! project Blog [new features, events, etc.]">blog</a> for the latest news about the GroupMe! project.
				<br />
				The best way to get to know GroupMe! is to create an account and to create groups of your interests, so lets go on with the next section!
				</div>
				
				<p class="doc">&nbsp;<a href="#top"><img src="<%= request.getContextPath() %>/images/uparrow.png" height="16px" style="text-decoration:none;border:none;" alt="up"/></a></p>
				
				<h3><a class="anker" name="section2">Create an account</a></h3>
				
				<div class="section">
				It is as easy as it sounds: just visit <a href="<%= request.getContextPath() + "/home/register" %>" title="Create a GroupMe! account">this</a> page and fill out the registration form!
				<br /><br />
				<table cellspacing="0" cellpadding="5">
					<tr>
						<td style="border:5px solid #BCC9D7;">
							<img src="<%= request.getContextPath() %>/images/manpages/registration.png" height="400px" style="text-decoration:none;border:none" alt="registration form"/>
						</td>
					</tr>
					<tr>
						<td style="background-color: #BCC9D7; color:black;">Registration form</td>
					</tr>
				</table>
				<br /><br />
				</div>
			
				<p class="doc">&nbsp;<a href="#top"><img src="<%= request.getContextPath() %>/images/uparrow.png" height="16px" style="text-decoration:none;border:none;" alt="up"/></a></p>	
					
				<h3><a name="section3" class="anker">myGroupMe! - Your personal GroupMe! home page</a></h3>
				
				<div class="section">
				If you log in to GroupMe!, you'll end up at myGroupMe! - your personal GroupMe! home page, which provides you an overview of your groups, your top 50 tags and a summary about your 3 latest groups, favorites and dashboard news.
				<br />Furthermore you have the possibility to edit or delete your groups or to sort your groups alphabetically or by date.  
				<br /><br />
				
				<table cellspacing="0" cellpadding="5">
					<tr>
						<td style="border:5px solid #BCC9D7;">
							<img src="<%= request.getContextPath() %>/images/manpages/mygroupme_ow.png" height="560px" style="text-decoration:none;border:none" alt="MyGroupMe! overview"/>
						</td>
					</tr>
					<tr>
						<td style="background-color: #BCC9D7; color:black;">myGroupMe! overview</td>
					</tr>
				</table>
				<br /><br />
				
				<strong>The menu bar</strong>
				<br /><br />
				myGroupMe! provides you with a menu bar that gives you access to the following options:
				<br /><br />
				<ul>
					<li>create a new group</li>
					<li>take a look your personal profile page (menu item 'you')</li>
					<li>list your favorite groups</li>
					<li>list your groups</li>
					<li>take a look your dashboard</li>
					<li>edit your account settings, e.g. your photo or foaf-URL</li>
				</ul> 
				<br /><br />
				
				<table cellspacing="0" cellpadding="5">
					<tr>
						<td style="border:5px solid #BCC9D7;">
							<img src="<%= request.getContextPath() %>/images/manpages/mygroupme_menu.png" width="600px" style="text-decoration:none;border:none" alt="MyGroupMe! menu bar"/>
						</td>
					</tr>
					<tr>
						<td style="background-color: #BCC9D7; color:black;">myGroupMe! menu bar</td>
					</tr>
				</table>
				<br /><br />
				The following video provides an overview about myGroupMe!
				<br /><br />
				<object width="480" height="385"><param name="movie" value="http://www.youtube.com/v/JwjquKgqP3o&hl=de&fs=1&color1=0x006699&color2=0x54abd6"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/JwjquKgqP3o&hl=de&fs=1&color1=0x006699&color2=0x54abd6" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="480" height="385"></embed></object>
				</div>
				
				<p class="doc">&nbsp;<a href="#top"><img src="<%= request.getContextPath() %>/images/uparrow.png" height="16px" style="text-decoration:none;border:none;" alt="up"/></a></p>
				
				<h3><a name="section4" class="anker">Building groups</a></h3>
				 
				<div class="section">
				Creating groups is easy and intuitive. GroupMe!'s main benefit is it's dragging function that replaces traditional tagging systems.
				You simply drag resources into the group, tag it and that's it.
				<br />
				Follow these steps to create a new group:
				<br /><br />
				<ol>
					<li>Choose the 'create a new group' option on the menu bar to start the group-creation process.</li>
					<li>Enter a name for the group and an optional description, that gives more information about what the group is about.</li>
					<li>Drag resources from the search result list (on the right side) into the group</li>
					<li>Enter some tags for the resource (to enter more tags just seperate them by a comma) [optional]</li>
					<li>Arrange and resize the resources as you like it [optional]</li>
					<li>Enter some tags for the group [optional]</li>
				</ol>
								
				<br /><br />
				The following video tutorial shows you how easy it is to create groups in GroupMe!
				<br /><br />
				<object width="480" height="385"><param name="movie" value="http://www.youtube.com/v/BmvD5qw-ii4&hl=de&fs=1&color1=0x006699&color2=0x54abd6"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/BmvD5qw-ii4&hl=de&fs=1&color1=0x006699&color2=0x54abd6" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="480" height="385"></embed></object>
				</div>
				
				<p class="doc">&nbsp;<a href="#top"><img src="<%= request.getContextPath() %>/images/uparrow.png" height="16px" style="text-decoration:none;border:none;" alt="up"/></a></p>
			
				<h3><a name="section5" class="anker">Browsing through GroupMe!</a></h3>
				
				<div class="section">
				The following video takes you on a tour through GroupMe!
				<br /><br />
				<object width="480" height="385"><param name="movie" value="http://www.youtube.com/v/xq_jq6qePjs&hl=de&fs=1&color1=0x006699&color2=0x54abd6"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/xq_jq6qePjs&hl=de&fs=1&color1=0x006699&color2=0x54abd6" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="480" height="385"></embed></object>
				</div>
				
				<p class="doc">&nbsp;<a href="#top"><img src="<%= request.getContextPath() %>/images/uparrow.png" height="16px" style="text-decoration:none;border:none;" alt="up"/></a></p>
			
				<h3><a name="section6" class="anker">Using the bookmarklet functionality</a></h3>
				
				<div class="section">
				With the bookmarklet functionality, you are now able to add content to your GroupMe! groups via your browser while you are navigating through the web. 
				Just add the following link to the bookmarks of your browser: <br /><br />
				<a href="javascript:w=open('%20http://groupme.org/GroupMe/addToGroupMe.do?url='+encodeURIComponent(location.href)+'&title='+encodeURIComponent(document.title),'add','width=720,height=755,scrollbars,resizable');void(window.setTimeout('w.focus()',200)%20);"><img src="<%= request.getContextPath() %>/images/g-24x24_glossy.png" width="16px" style="text-decoration:none;border:none" alt="add to GroupMe!"/></a>
				<a href="javascript:w=open('%20http://groupme.org/GroupMe/addToGroupMe.do?url='+encodeURIComponent(location.href)+'&title='+encodeURIComponent(document.title),'add','width=720,height=755,scrollbars,resizable');void(window.setTimeout('w.focus()',200)%20);">add to GroupMe!</a>
				<br /><br />
				The next step is to add this bookmark to the bookmarks-toolbar of your browser so that the GroupMe! button is always available.
				<br />
				Whenever you want to add a website, image, etc. to one of your GroupMe! groups, then just click on the GroupMe! button within your bookmarks toolbar and choose the group that the website, image etc. should be added to.
				<br /><br />
				The following video guides you through setting up the bookmarklet functionality within Firefox and shows how to use the bookmarklet functionality:
				<br /><br />
				<object width="480" height="385"><param name="movie" value="http://www.youtube.com/v/C1CBpwR-ntE&hl=de&fs=1&color1=0x006699&color2=0x54abd6"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/C1CBpwR-ntE&hl=de&fs=1&color1=0x006699&color2=0x54abd6" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="480" height="385"></embed></object>
				</div>
				
				<h3><a name="api" class="anker">GroupMe! API</a></h3>
				
				<div class="section">
				<p>GroupMe! provides different APIs that allow other applications to integrate GroupMe! data and functionality into their applications.
				The most popular API of GroupMe! is the <a href="./api/rest/">REST API</a>, which is RDF-based and adheres to the <a href="http://www.linkeddata.org">Linked Data</a> 
				principles.<br/>
				An overview of the APIs can be found here: <a href="./api/">Overview - GroupMe! APIs</a>. <br/><br/>
				Drop us an email (<a href="mailto:groupme@kbs.uni-hannover.de">groupme@kbs.uni-hannover.de</a>) if you need further help!</p>
				</div>
			
			</div>
			
		</div>
	</div>
	<!-- footer -->
	<div id="footer">
		<%@ include file="./jsp-includes/footer.jsp" %>
	</div>
	</body>
	</html>